<script setup>
// import { GetListAPI } from '@/api/statistics/procure/orderTack.js'
const { proxy } = getCurrentInstance()

const { table_purchase_status } = proxy.useDict('table_purchase_status')

// 列表数据
const tableData = ref([])

// 按钮
const buttonList = ref([{ type: 'export', hasPermi: 'finance:dataChange:export' }])

// 列表枚举
const column = ref([
  { label: '采购订单号', prop: 'purchaseOrderNo', width: '180' },
  { label: '单据状态', prop: 'status', width: '80' },
  { label: '物料编码', prop: 'materialCode', width: '180' },
  { label: '物料名称', prop: 'materialName', width: '180' },
  { label: '物料类别', prop: 'materialCategoryDict' },
  { label: '规格', prop: 'materialSpec' },
  { label: '辅助属性', prop: 'auxiliaryAttribute', showText: true },
  { label: '单位', prop: 'unitDict' },
  { label: '采购人员', prop: 'purchaseByDict' },
  { label: '供应商名称', prop: 'supplierName' },
  { label: '计划量', prop: 'plannedWeight' },
  { label: '已入库量', prop: 'actualQuantity' },
  { label: '未入库量', prop: 'noWareWeight' },
  { label: '采购金额', prop: 'purchasePrice' },
  { label: '未入库金额', prop: 'noWareWeightPrice' },
  { label: '到货日期', prop: 'estimatedTime' },
  { label: '发票数量', prop: 'invoicedQuantity' },
  { label: '已开票金额', prop: 'invoicedAmount' },
  { label: '未开票金额', prop: 'noInvoicedAmount' }
])

// 状态
const state = reactive({
  treeLoading: false,
  loading: false, // 列表加载状态
  btnLoading: false, // 按钮加载状态
  isShow: false, // 弹窗状态
  title: '新增', // 弹窗标题
  total: 0 // 列表总量
})

// 查询条件
const query = reactive({
  pageNum: 1,
  pageSize: 10
})

// 查询条件 枚举
const selectList = ref([
  { type: '日期范围' },
  { label: '采购订单号', model: 'purchaseOrderNo', type: '输入框' },
  { label: '供应商', model: 'supplierName', type: '输入框' },
  { label: '物料名称', model: 'materialName', type: '输入框' },
  {
    label: '单据状态',
    model: 'status',
    type: '下拉单选',
    opt: table_purchase_status
  },
  { label: '显示开票数量为0的订单', model: 'isZero', type: '复选框' }
])

// 导出
const exportFun = () => {}

// 查询条件
const selectSubmit = val => {
  Object.keys(val).forEach(keyItem => (query[keyItem] = val[keyItem]))
  getList()
}

// 获取列表
const getList = async () => {
  state.loading = true
  try {
    const result = await GetListAPI(query)
    tableData.value = result.rows
    state.total = result.total
  } catch {
  } finally {
    state.loading = false
  }
}
getList()
</script>

<template>
  <div class="app-container">
    <!-- 查询条件组件 -->
    <p-select-form :selectForm="selectList" @selectSubmit="selectSubmit" />
    <el-card>
      <!-- 按钮组件 -->
      <p-button :list="buttonList" @add="addDic" />
      <!-- 表格数据 -->
      <p-table
        class="tableClass"
        summary
        :amountList="[
          'plannedWeight',
          'actualQuantity',
          'noWareWeight',
          'purchasePrice',
          'noWareWeightPrice',
          'invoicedQuantity',
          'invoicedAmount',
          'noInvoicedAmount'
        ]"
        :isSel="false"
        :loading="state.loading"
        :data="tableData"
        :column="column"
        v-model:page="query.pageNum"
        v-model:limit="query.pageSize"
        :total="state.total"
        @change="handleSelectionChange"
        @pagination="getList"
      >
        <template #columnCell="{ column, record }">
          <p-dictTag v-if="column.label == '单据状态'" :options="table_purchase_status" :value="record.status" />
          <!-- 辅助属性 -->
          <p-producer :data="record.auxiliaryAttribute" v-if="column.label == '辅助属性'" />
        </template>
      </p-table>
    </el-card>
  </div>
</template>
<style scoped lang="scss"></style>
